<template>
  <div id="app" ref="allApp" @scroll="changeScrollHeight">
    <van-nav-bar :title="currentPageText">
      <img :src="navInfo.logo_src" height="25" slot="left" alt="logo" title="logo"/>
      <van-button slot="right" @click="openSearch">
        <van-icon class="icon" style="color:#999999;font-size:25px;" :name="!isMoreIcon?'wap-nav':'cross'"/>
      </van-button>
    </van-nav-bar>
    <search-index :product="productInfo"/>
    <div class="router">
      <router-view @changeScroll="changeScroll"/>
    </div>
    <choose-link-type @changeScroll="changeScroll" v-for="(list,index) in links" :key="index" :info="list"/>
    <bottom-footer :icp_src="navInfo.icp_src" :icp_title="navInfo.icp_title"/>
    <load-ing/>
  </div>
</template>

<script>
  import searchIndex from '@/components/search/searchIndex'
  import bottomFooter from '@/components/commonComponents/bottomFooter'
  import loadIng from '@/components/commonComponents/loadIng'
  import chooseLinkType from '@/components/commonComponents/chooseLinkType'
  export default {
  name: 'App',
  data(){
    return{
      companyVisible:true,
      contactVisible:true,
      linksVisible:true,
    }
  },
  components:{
    ChooseLinkType:chooseLinkType,
    searchIndex:searchIndex,
    bottomFooter:bottomFooter,
    loadIng:loadIng,
  },
  computed:{
    lang:{
      get(){
        let storageData = window.sessionStorage.getItem('lang');
        if(this.$store.state.lang!==storageData&&storageData!=='null'){
          this.$store.dispatch('toChangeLang', storageData);    //同步操作
        }
        return this.$store.getters.getLang;
      },
      set(){}
    },
    navInfo:{
      get(){
        return this.$store.getters.getNavInfo;
      },
      set(){}
    },
    links:{
      get(){
        return this.$store.getters.getLinks.link;
      },
      set(){}
    },
    //搜索栏中的产品
    productInfo:{
      get(){
        return this.$store.getters.getSearchProduct;
      },
      set(){}
    },
    currentPageText:{
      get(){
        let storageData = window.sessionStorage.getItem('currentPageText');
        if (this.$store.state.currentPageText !== storageData&&storageData!=='null') {
          this.$store.state.currentPageText=storageData;    //同步操作
        }
        return this.$store.getters.getCurrentPageText;
      },
      set() {
      }
    },
    isMoreIcon:{
        get:function () {
          return this.$store.getters.getSearchPopup;
        },
        set:function(){
        }
      },
    indexProductId:{
      get(){
        let storageData = window.sessionStorage.getItem('productIndexId');
        if(this.$store.state.productIndexId===0&&storageData!=='null'){
          this.$store.dispatch('toChangeProductIndexId', storageData);    //同步操作
        }
        return this.$store.getters.getProductIndexId;
      },
      set(){}
    },
    nowPage:{
      get(){
        let storageData = window.sessionStorage.getItem('nowPage');
        if (this.$store.state.nowPage !== storageData&&storageData!=='null') {
          this.$store.state.nowPage=storageData;    //同步操作
        }
        return this.$store.getters.getNowPage;
      },
      set(){}
    }
  },
    methods: {
      changeScrollHeight(e){
        if(this.$refs.allApp.scrollTop>46){
          document.documentElement.scrollTop=this.$refs.allApp.scrollTop;
          document.body.scrollTop=this.$refs.allApp.scrollTop;
          window.pageYOffset=this.$refs.allApp.scrollTop;
        }
      },
      changeScroll(){
        this.$refs.allApp.scrollTop=0;
      },
      openSearch:function(){
        this.$store.dispatch('toChangeSearchPopup');
        if(this.$store.getters.getSearchPopup){
          this.$store.dispatch('toChangeCurrentPageText',this.$t('search.searchText'));
        }else{
          this.$store.dispatch('toChangeCurrentPageText',this.$store.getters.getLastCurrentPageText);
        }
      },
      getBrowserLang(){
        let storageLang = window.sessionStorage.getItem('lang');
        let lang='';
        if(storageLang===null){
          window.sessionStorage.setItem('lang','en');//已修改为英文
          this.$store.dispatch('toChangeLang','en');
        }
        if(storageLang!==lang&&storageLang!==null){
          this.$store.dispatch('toChangeLang', storageLang);
        }
        this.$i18n.locale=this.$store.getters.getLang;
      },
      getLastCurrentPageText(){
        let lastPageText=window.sessionStorage.getItem('lastCurrentPageText');
        if(lastPageText!=='null'||lastPageText!==this.$store.getters.getLastCurrentPageText){
          this.$store.state.lastCurrentPageText=lastPageText;
        }
        if(this.$store.state.currentPageText==='派实'||this.$store.state.currentPageText==='search'||this.$store.state.currentPageText==='搜索'){
          this.$store.dispatch('toChangeCurrentPageText',this.$store.getters.getLastCurrentPageText);
        }
      },
      changeProductId(){
        let prodIndexId=window.sessionStorage.getItem('productIndexId');
        if(prodIndexId==='null'){
          this.$store.dispatch('toChangeProductIndexId', this.productInfo[0].id);
        }
      },
      //获取友情链接
      getTheLinks(lang){
        let _this=this;
        this.axios.get(domain.url+'system/api/get_link', {
          params: {
            language:lang,
          }
        })
          .then(function (response) {
            //console.log(response);
            _this.$store.dispatch('toChangeLinks',response.data);
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      //首次访问时获取菜单栏第一个产品的信息
      getIndexProductInfo(id,lang){
        let _this=this;
        this.axios.get(domain.url+'product/api/get_product', {
          params: {
            id:id,
            language:lang,
            equipment:'mobile'
          }
        })
          .then(function (response) {
            _this.$store.dispatch('toChangeProductInfo',response.data);
            _this.changeProductId();
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      //获取菜单栏的产品
      getJson(lang){
        let _this=this;
        let nowPage=this.nowPage;
        if(lang==='en'){
          document.title='purse';
        }else{
          document.title='派实';
        }
        this.$store.dispatch('toChangeLoadIngVisible',true);
        this.axios.get(domain.url+'system/api/get_nav_bar', {
        params: {
          language:lang
        }
      })
        .then(function (response) {
          _this.$store.dispatch('toChangeNavInfo',response.data.config);
          _this.$store.dispatch('toChangeSearchProduct',response.data.product);
          if(nowPage===null||nowPage===''||(nowPage==='/'&&_this.indexProductId===_this.productInfo[0].id)) {
            _this.getIndexProductInfo(_this.productInfo[0].id, lang);
            _this.$store.dispatch('toChangeCurrentPageText',response.data.product[0].title);
          }
          _this.reflash_goBack();
          _this.$store.dispatch('toChangeLoadIngVisible',false);
        })
        .catch(function (error) {
          console.log(error);
        });
      },
      changeI18N(){
        let lang=window.sessionStorage.getItem('i18n');
        if(lang!==null) {
          if (lang !== this.$i18n.locale) {
            this.$i18n.locale = lang;
          }
        }
      },
      //刷新后导航栏能显示正确的导航标题
      changeCurrentPageText(route){
        //显示当前页
        let lang=this.lang;
        if(route==='/MallIndex'){
          if(lang==='en'){
            this.$store.dispatch('toChangeCurrentPageText','mall');
          }else{
            this.$store.dispatch('toChangeCurrentPageText','商城');
          }
        }
        if(route==='/brandIndex'){
          if(lang==='en'){
            this.$store.dispatch('toChangeCurrentPageText','brand');
          }else{
            this.$store.dispatch('toChangeCurrentPageText','品牌');
          }
        }
        if(route==='/CompanyProfileIndex'){
          if(lang==='en'){
            this.$store.dispatch('toChangeCurrentPageText','company profileIndex');
          }else{
            this.$store.dispatch('toChangeCurrentPageText','公司介绍');
          }
        }
        if(route==='/theNewsList'){
          if(lang==='en'){
            this.$store.dispatch('toChangeCurrentPageText','news list');
          }else{
            this.$store.dispatch('toChangeCurrentPageText','新闻');
          }
        }
        if(route==='/NewsDetails'){
          if(lang==='en'){
            this.$store.dispatch('toChangeCurrentPageText','news details');
          }else{
            this.$store.dispatch('toChangeCurrentPageText','新闻详情');
          }
        }
      },
      //刷新后回到原页面
      reflash_goBack(){
        let route=this.$store.getters.getNowPage;
        let storageData=window.sessionStorage.getItem('nowPage');
        if(storageData===undefined || storageData===null){}else{
          if(route!==storageData){
            this.$store.dispatch('toChangeNowPage',storageData);
            route=this.$store.getters.getNowPage;
          }
          this.getLastCurrentPageText();
          this.$store.dispatch('toChangeAboutUsOrOurProductsId',route);
          this.$router.push(route);
          this.changeCurrentPageText(route);
        }
      },
    },
    created(){
      this.getBrowserLang()
      this.getJson(this.$store.getters.getLang);
      this.getTheLinks(this.$store.getters.getLang);
      this.changeI18N();
      //this.getLastCurrentPageText();
      //this.showInfo();
    },
    mounted(){
      // document.addEventListener('scroll',this.changeScrollHeight);
      //强制让内容超过
      //this.$refs.allApp.style.height=window.innerHeight+100;
      //window.scrollTo(0, 1);
      //重置成新高度
      //this.$refs.allApp.style.height=window.innerHeight;
      //非常重要，用于兼容不同机型，防止浏览器窗口移动
      /*document.addEventListener('touchmove', function (e) {
        if (e.cancelable) {
          // 判断默认行为是否已经被禁用
          if (!e.defaultPrevented) {
            e.preventDefault();
          }
        }
        },{passive: false});*/
    }
  }
</script>
<style>
  *{
    margin: 0;
    padding:0;
  }
  body,html{
    width:100%;
    height:100%;
  }
  #app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #999999;
  overflow-x:hidden;
  width:100%;
  height:100%;
    -webkit-overflow-scrolling: touch;
}
  .van-icon{
    font-size:25px;
  }
  .icon{
    color:#999999 !important;
    font-size:25px !important;
  }
.van-nav-bar__left img{
  vertical-align: middle;
}
  .van-nav-bar__left{
    left:10px;
  }
  .van-nav-bar__right{
    padding-right: 0;
    margin-right: -10px;
    right:10px !important;
  }
  .van-nav-bar__right button{
    border:0;
    background:rgba(0,0,0,0);
    padding-left:10px;
    padding-right: 10px;
  }
  .router{
    overflow: auto;
  }
  .van-nav-bar__text{
    color:#999999;
  }
  .van-nav-bar .van-icon{
    color:#999999;
  }
</style>
